/*
 * @Description:
 * @Version: 2.0
 * @Autor: Seven
 * @Date: 2023-09-21 15:21:22
 * @LastEditors: Seven
 * @LastEditTime: 2024-03-04 10:09:34
 */
import React, { memo, useState } from "react";
import { AppHeader } from "./styled.js";
import { titleList } from "@/common/local-data.js";
import { Button } from "antd";
import { useNavigate } from "react-router-dom";
import dayjs from "dayjs";

const Header: React.FC = memo(() => {
  type NavigateType = (val: string, num: number) => void;
  const navigate = useNavigate();
  const [currentIndex, setCurrentIndex] = useState(0);
  const BtnNavgateTo: NavigateType = (path, index) => {
    navigate(path);
    setCurrentIndex(index);
  };
  return (
    <AppHeader>
      <div className="item1">
        基于智能运维的城市轨道交通应急防灾和安全运营平台
      </div>
      <div className="item2">
        {titleList.map((item, index) => {
          return (
            <Button
              style={{
                width: "120px",
                height: "40px",
                backgroundColor: "rgb(0, 128, 128)",
                fontSize: "16px",
              }}
              key={item.id}
              type="primary"
              className={index === currentIndex ? "btnStyleShow" : ""}
              onClick={(e) => BtnNavgateTo(item.path, index)}
            >
              {item.title}
            </Button>
          );
        })}
      </div>
      <div className="item3">
        <span className="itemSpanStyle">
          <i className="item iconfont icon-duoyun"></i>
          <span>多云</span>
        </span>
        <span className="itemSpanStyle">
          <i className="item iconfont icon-shizhong"></i>
          <span>{dayjs().format("YYYY-MM-DD")}</span>
        </span>
        <span className="itemSpanStyle">
          <i className="item iconfont icon-shenfenzheng"></i>
          <span className="admin">admin</span>
        </span>
        <span className="itemSpanStyle">
          <i className="item iconfont icon-guanji"></i>
        </span>
      </div>
    </AppHeader>
  );
});

export default Header;
